<template>
   <div class="group-view has-header">
       <user-bar></user-bar>
       <group title="租房找室友" :items="group_a">
            <a class="list-link" href="#" slot="more">更多相关小组</a>
       </group>
       <group title="来聊五块钱" :items="group_b">
           <a class="list-link" href="#" slot="more">来聊五块钱</a>
       </group>
       <group title="买买买" :items="group_c">
            <a class="list-link" href="#" slot="more">更多相关小组</a>
       </group>
       <download-app></download-app>
   </div>
</template>

<script>
import UserBar from '../component/UserBar.vue';
import Group from '../component/Group.vue';
import DownloadApp from '../component/DownloadApp.vue';

   export default {
       name: 'group-view',
       components: { UserBar, Group, DownloadApp },
       data(){
           return {
               group_a: '',
               group_b: '',
               group_c: ''
           }
       }

 }
</script>

<style lang="scss" scoped>
.list-link {
  display: block;
  margin-bottom: 3rem;
  padding: 1.5rem 0;
  font-size: 1.6rem;
  line-height: 1.8rem;
  text-align: center;
  color: #42bd56;
}
.user-bar {
  margin-bottom: 1.5rem;
}
</style>
